<!-- ChromeFrame Support -->
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!--
   /**
    * The Render Engine
    * FontEditor
    *
    * A tool for marking character boundaries in bitmap fonts and
    * generating font support file.
    *
    *
    * @author: Brett Fattori (brettf@renderengine.com)
    *
    * @author: $Author$
    * @version: $Revision$
    *
    * Copyright (c) 2010 Brett Fattori (brettf@renderengine.com)
    *
    * Permission is hereby granted, free of charge, to any person obtaining a copy
    * of this software and associated documentation files (the "Software"), to deal
    * in the Software without restriction, including without limitation the rights
    * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
    * copies of the Software, and to permit persons to whom the Software is
    * furnished to do so, subject to the following conditions:
    *
    * The above copyright notice and this permission notice shall be included in
    * all copies or substantial portions of the Software.
    *
    * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
    * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
    * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
    * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
    * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
    * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
    * THE SOFTWARE.
    *
    */
-->

<html>
   <head>
      <title>The Render Engine - Font Editor</title>

      <!-- Supporting Libraries -->
      <script type="text/javascript" src="../../libs/base.js"></script>
      <script type="text/javascript" src="../../libs/jquery.js"></script>
      <script type="text/javascript" src="../../libs/jquery.ext.engine.js"></script>
      <script type="text/javascript" src="../../libs/sylvester.js"></script>
      <script type="text/javascript" src="../../libs/json2.js"></script>

      <!-- Load the main engine script -->
      <script type="text/javascript" src="../support/editor_support.js"></script>
      <script type="text/javascript" src="../../engine/runtime/engine.js"></script>

      <style type="text/css">
      	body {
      		font: 10pt Arial;
      	}

			div.loadbox {
				width: 325px;
				height: 30px;
				padding: 10px;
				font: 10px Arial;
				border: 1px outset gray;
				-moz-border-radius: 10px;
				-webkit-border-radius: 10px;				
			}

         #engine-load-progress {
            position: relative;
            border: 1px inset gray;
            width: 300px;
            height: 5px;
         }

         #engine-load-progress .bar {
            background: silver;
         }
			
			#infoForm {
				display: none;
				position: absolute;
				top: 150px;
				left: 10px;
				padding: 5px;
				border: 1px solid;
				font: 10px Arial;
			}
      </style>
   </head>
   <body>
      <span id="loading">
      	<table border="0" style="width:100%;height:100%;">
      		<tr>
      			<td style="width:100%;height:100%;" valign="middle" align="center">
						<div class="loadbox">
							Loading Bitmap Font Editor...
		         		<div id="engine-load-progress"></div>
							<span id="engine-load-info"></span>
						</div>
					</td>
      		</tr>
      	</table>
      </span>
      <script type="text/javascript">
         // Load the game script
         Engine.loadGame('game.js','FontEditor');
      </script>

		<div id="infoForm">
			<b>Font URL: </b><input type='text' id='fontURL' size='70' value=''/>
			<input type="button" id="loadFile" value="Load..."/><br/>
			<b>Font Name: </b><input type='text' id='fontName' size='40'/><br/>
			<b>Width: </b><input type='text' id='fontWidth' size='5' value="1789"/><br/>
			<b>Height: </b><input type='text' id='fontHeight' size='5' value="37"/><br/>
			<b>Size: </b><input type='text' id='fontSize' size='5'/><br/>
			<!-- Deprecated
			<b>Uppercase Only? </b><input type='checkbox' id='fontUpper'/><br/>
			-->
			<b>Kerning: </b><input type='text' size='5' id='fontKerning' value="0.88"/><br/>
			<b>Space Width: </b><input type='text' size='5' id='fontSpace' value="20"/><br/>
			<b>Min Alpha: </b><input type='text' size='5' id='minAlpha' value="100"/>
			<input type="button" id="analyze" value="Analyze Font"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			Identified: <span id="identified">0</span> of 90 characters&nbsp;&nbsp;
			<input type="button" id="generate" value="Generate"/>&nbsp;
			<input type="checkbox" id="fontBold"/>Bold<br/>
			<textarea id="fontDef" cols="70" rows="10"></textarea>
		</div>
   </body>
</html>